<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, user-scalable=no,maximum-scale=1">
    <title>lal接口测试</title>
    <link rel="stylesheet" href="../src/css/common.css">
    <style>
        *{
            margin: 0;padding: 0;
        }
        html,body {
            height: 100%;
            /*background-color: #efefef;*/
        }
        button {
            margin-top: 20px;
            width: 200px;
            height: 35px;
            font-size: 20px;
            background-color: #b3d4fc;
        }
    </style>
</head>
<body>
<input type="text" value="rtmp://192.168.1.196:1935/live/rs_4" id="rtmp" placeholder="请输入RTMP或RTSP地址"><br>
<input type="text" value="rm_1" id="room_name" placeholder="请输入房间名">
<br>
<button onclick="start_relay_pull()">开始拉流</button>
<button onclick="stop_relay_pull()" style="background-color: tomato;">停止拉流</button>
<script src="../src/js/axios.min.js"></script>
<script>
    let valueEl = document.getElementById('rtmp')
    let roomEl = document.getElementById('room_name')
    function start_relay_pull() {
        axios.post('http://192.168.1.196:8083/api/ctrl/start_relay_pull',{
            "url": valueEl.value,
            "stream_name": roomEl.value,
            "pull_retry_num": 5,
            "rtsp_mode": 0
        }).then(function (response) {
            if(response.status === 200)
            {
                console.log("room创建成功!");
                console.log(response.data);
            }
            
        })
        .catch(function (error) {
            console.log(error);
        });
    }

    function stop_relay_pull() {
        axios.get('http://192.168.1.196:8083/api/ctrl/stop_relay_pull?stream_name='+roomEl.value).then(function (response) {
            if(response.status === 200)
            {
                console.log("room关闭成功!");
                console.log(response.data);
            }
            
        })
        .catch(function (error) {
            console.log(error);
        });
    }


    // 查看正在直播的所有房间
    function all_group() {
        axios.get('http://192.168.1.196:8083/api/stat/all_group',{})
            .then(function (response) {
                if(response.status === 200)
                {
                    console.log("请求成功!");
                    console.log(response.data);
                }
             
            })
            .catch(function (error) {
                console.log(error);
            });
    }

    //韩国GOOD TV推流地址 rtmp://mobliestream.c3tv.com:554/live/goodtv.sdp
/**
 * 
 * RTSP 流转成 RTMP
 * 
 * 使用FFmpeg命令
 * 

 * 1. 启动lalserver
 * 2. 模拟RTSP推流
ffmpeg -re -stream_loop -1 -i C:\Users\Administrator\Desktop\test.mp4 -vcodec libx264 -rtsp_transport tcp -f rtsp rtsp://127.0.0.1:5544/live/rs_1
ffmpeg -re -stream_loop -1 -i C:\Users\Administrator\Desktop\test.mp4 -c copy -rtsp_transport tcp -f rtsp rtsp://127.0.0.1:5544/live/rs_1
 * 3. 拉取RTSP转成RTMP
ffmpeg -i "rtsp://127.0.0.1:5544/live/rs_1" -vcodec libx264 -acodec aac -f flv rtmp://127.0.0.1:1935/live/rm_1
 * 4. 播放转换后的 rtmp流
ffplay rtsp://127.0.0.1:5544/live/rs_1

ffplay rtmp://127.0.0.1:1935/live/rm_1

ffplay http://127.0.0.1:8080/hls/rs_4.m3u8


// 下面命令推流正常, 
ffplay播放hls正常, 但是vlc和浏览器播放hls画面马赛克模糊

ffmpeg -re -stream_loop -1 -i C:\Users\Administrator\Desktop\test2.mp4 -vcodec libx264 -rtsp_transport tcp -f rtsp rtsp://127.0.0.1:5544/live/rs_4

ffmpeg -re -stream_loop -1 -i C:\Users\Administrator\Desktop\test.mp4 -vcodec libx264 -rtsp_transport tcp -f rtsp rtsp://127.0.0.1:5544/live/rs_4


 -rtsp_transport tcp // 不加此行会导致部分画面马赛克
 -vcodec libx264 // 不加此行会导致hls播放只有声音没有图像 -c copy (hls播放有bug)


*/
</script>
</body>
</html>